<script setup>
    import { sdCityList } from '@/utils/index'
    import FormList from '@/components/FormList.vue'

    let dialogVisible = $ref(false)
    let form = $ref({})

    let showType = $ref('')

    const showAddMember = (data, type) => {
        console.log(data)
        form = data
        showType = type
        dialogVisible = true
    }

    const formItem = [
        {
            label: '所属区划',
            value: 's1',
            type: 'select',
            selectData: sdCityList
        },
        {
            label: '姓名',
            value: 's2',
        },
        {
            label: '性别',
            value: 's3',
            type: 'select',
            selectData: ['男', '女']
        },
        {
            label: '人员类别',
            value: 's4',
            type: 'select',
            selectData: ['农民', '学生', '工人', '社会人士', '农村低收入人口']
        },
        {
            label: '困难类别',
            value: 's5',
            type: 'select',
            selectData: ['低保户']
        },
        {
            label: '身份证号码',
            value: 's6',
        },{
            label: '就失业登记号',
            value: 's7',
        }
    ]

    const changeForm = (v, data) => {
        form[v] = data
    }


    defineExpose({
        showAddMember
    })

</script>

<template>
    <el-dialog
        v-model="dialogVisible"
        :title="showType == 'edit' ? '修改' : '详情'"
        custom-class="zz-dialog"
        width="880px"
        v-if="dialogVisible"
    >	
        <form-list :list="formItem" :formData="form" :type="showType" @changeForm="changeForm"></form-list>

        <template #footer v-if="showType != 'details'">
            <span class="dialog-footer">
                <el-button @click="dialogVisible = false">取消</el-button>
                <el-button type="primary" @click="dialogVisible = false">
                    确定
                </el-button>
        </span>
        </template>
    </el-dialog>
</template>
